<template>
  <view class="index">
    <Header :banner="banner"></Header>
    <OrderList :order_list="order_list" ></OrderList>
    <Tabbar></Tabbar>
  </view>
</template>
<script>
// 底部导航
import Tabbar from "@/components/TabBar.vue";

// 页面上部元素
import Header from "./components/header/header.vue";

//列表统计数据
// import CommunicList from "./components/communicList/communicList.vue";
  import OrderList from '@/components/orderList/orderList.vue'


import Taro from "@tarojs/taro";
import "./main.less";
import { getMain } from "/src/service/apis/main";
// import baseMixin from '@/mixin/baseMixin';
import {
  ref,
  reactive,
  toRefs,
  onMounted,
  onUnmounted,
} from "@vue/runtime-core";
export default {
  name: "main",
  // mixins:[baseMixin],
  setup(props, ctx) {
    let state = reactive({
      banner: [
        { name: "123", age: 12 },
        { name: "345", age: 22 },
      ], //轮播图
      order_list: [], //订单列表
    });

    //获取数据
    const getData = async () => {
      let { data } = await getMain();
      data = data.data;
      state.banner = data.banner;
      state.order_list = data.order_list;
    };

    onMounted(() => {
      //设置顶部导航栏
      Taro.setNavigationBarColor({
        frontColor: "#ffffff",
        backgroundColor: "#FA6364",
      });
      getData();
    });

    return {
      ...toRefs(state),
    };
  },

  components: {
    Tabbar,
    Header,
    OrderList,
  },
};
</script>
